[#include "/includes/_layout.html"/]
[#macro css_import]
<link rel="stylesheet" type="text/css" href="${webctx}/resources/js/jquery/themes/ui-lightness/jquery-ui-1.10.3.custom.css"/>
<link rel="stylesheet" type="text/css" href="${webctx}/resources/css/fbuilder.css"></link>
[/#macro]
[@layout]
<div class="wrapper wrapper-content">
	<div class="row content-tabs">
		<nav class="page-tabs J_menuTabs">
	       <div class="page-tabs-content" style="margin-left: 0px;">
	           <a href="${webctx}/order" class="J_menuTab active">我的订单</a>
	       </div>
	   	</nav>
	</div>
	<div class="row panel-body">
		<div style="padding-left: 20px;">
			<button id="mySendProductBtn" class="btn btn-primary btn-xs">批量发货</button>
		</div>
	</div>
	
	<div class="row ibox-content">
		<table width="100%" border="0" cellspacing="1" cellpadding="0" class="table table-striped table-bordered bootstrap-datatable datatable">
			<tr>
				<td colspan="3" style="text-align: left;">&nbsp;&nbsp;
					<input type="text" id="start_date" name="start_date" style="width: 120px; cursor: pointer;"
					onfocus="WdatePicker({isShowClear:false,readOnly:true,dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'end_date\')}'})"
					class="Wdate" value="" />
					&nbsp;&nbsp;至&nbsp;&nbsp; 
					<input type="text" id="end_date" name="end_date" style="width: 120px; cursor: pointer;"
					onfocus="WdatePicker({isShowClear:false,readOnly:true,dateFmt:'yyyy-MM-dd',mixDate:'#F{$dp.$D(\'start_date\');}'})"
					class="Wdate" value="" />
					
					<a class="label label-default" href="javascript:dateTagBf(-7);">一周前</a>
	                <a class="label label-default" href="javascript:dateTagBf(-30);">一个月前</a>
	                <a class="label label-default" href="javascript:dateTagBf(-90);">三个月前</a>
					
					&nbsp;&nbsp;&nbsp; 
					<select id="order_status_sel">
						<option value="p_unpaid">等待买家付款</option>
						<option value="p_paid" selected="selected">买家已付款</option>
						<option value="s_shipped">卖家已发货</option>
						<option value="p_refunded">卖家已退款</option>
						<option value="o_completed">交易已成功</option>
						<option value="">全部订单</option>
					</select> &nbsp;&nbsp;&nbsp; <a href="javascript:void(0)" id="mymoreCond">更多</a>
					&nbsp;&nbsp;&nbsp;
					<button id="myqueryBtn" class="btn btn-success">查询</button>
				</td>
			</tr>
		</table>
		
		<table id="moreCondition" class="table table-striped table-bordered" style="display: none;" class="t_c">
			<tr>
				<th>买家昵称</th>
				<td><input id="nick_name" type="text" /></td>
				<th>收货人</th>
				<td><input id="receiver_name" type="text" /></td>
				<th>收货人手机</th>
				<td><input id="receiver_phone" type="text" /></td>
				<!-- <td>
					<select id="shipping_status_sel">
						<option value="">全部</option>
						<option value="unshipped">未发货</option>
						<option value="shipped">已发货</option>
					</select>
				</td> -->
				<!-- <td>
					<select>
						<option value="001">全部</option>
						<option value="002" selected="selected">未打印</option>
						<option value="003">已打印</option>
					</select>
				</td> -->
			</tr>
		</table>
	
		<div id="printToolsbar" class="panel-body">
			<div id="pager" class="jqpager"></div>
			<span id="checkedLines" style="float: left;">您选择了<label style="font-size:16px;color:#f00;font-weight:bold;margin:0 3px;">0</label>单</span>		
		</div>
		<table id="mainTable" border="0" class="table table-striped table-bordered bootstrap-datatable datatable"> 
			<thead>
				<tr>
					<th><input type="checkbox" id="all" title="全选/反选" style="margin-right: 4px; vertical-align: middle;"/></th>
					<th>商品</th>
					<th>金额（元）</th>
					<th>买家</th>
					<th>收件人</th>
					<th>收件地址</th>
					<th>下单时间</th>
					<th>订单状态</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody class="tradeLotGrid"></tbody>
		</table>
	</div>
</div>

<!-- html 模板文件 -->
<!-- 模板区域开始 -->
<script type="text/template" id="order_table_tr_tpl">
<tr class="package">
	<td valign="middle">
		<input type="checkbox" class="commchk" id="checkbox_{orderId}" style="margin-right: 4px; vertical-align: middle;"/> 
	</td>
	<td><table id="order_item_{orderId}"></table></td>
	<td>{totalPrice} <br>邮费：{postFee}</td>
	<td>{buyerNick}<br><span style="color:red">{buyerMemoSimple}</span><i id="imsg_{orderId}" class="fa fa-question-circle" onmouseout="layer.closeAll();" onmouseover="layer.tips('{buyerMemo}。', this, {tips: [1, '#3595CC'],time: 0});"></i></td>
	<td>{receiverName}<br>{receiverPhone}</td>
	<td>{receiverProvince}{receiverCity}{receiverCountry}<br>{receiverAddr}</td>
	<td>{orderCreated}</td>
	<td>{orderStatus}</td>
	<td>
	<!-- <a id="detail_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">详情</a> -->
	<a id="a_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">发货</a>
    <a id="t_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">退款</a></td>
</tr>
</script>
<script type="text/template" id="order_item_table_tr_tpl">
<tr>
	<td><img src="{productImg}" style="margin: 2px" width="30" height="30" number="1"><br/>{productName}</td>
	<td>{price} X </td>
	<td>{quantity}</td>
	<td><span></span></td>
</tr>
</script>	
<!-- 模板区域结束 -->
[/@layout]
<script type="text/javascript">
//查询条件
var startDate = "", endDate = "", nickName = "", receiverName = "", receiverPhone="";
	$(document).ready(function() {
		//打印发货单
		$("#myInvoicePrintBtn").click(function(){
			if(TBatch.getCheckedCount() <=0){
				obz.info("请选择订单");
				return false;
			}
			$("#mainTable").mask("正在加载订单数据...");
			obz.ajaxJson(obz.ctx+"/order/getInvPrintData", {ids:TBatch.getChecked() }, function(resp){
				$("#mainTable").unmask();
				if(resp.code != 200){
					obz.error(resp.msg);
					return false;
				}
				var result = resp.data;
				Trade.useInvtpl = result.invoiceTemplate;		//发货单模板
				Trade.printInvoice(result.printData);			//打印的数据
			});
		});
		//打印快递单
		$("#myExpressPrintBtn").click(function(){
			if(TBatch.getCheckedCount() <=0){
				obz.info("请选择订单");
				return false;
			}
			var exp = $('input[name="myuseexpress"]:checked').val(); 
			if(!exp){
				obz.info("请选择快递模板");
				return false;
			}
			$("#mainTable").mask("正在加载订单数据...");
			obz.ajaxJson(obz.ctx+"/order/getExpPrintData", {ids:TBatch.getChecked(), exp:exp}, function(resp){
				$("#mainTable").unmask();	
				if(resp.code != 200){
					obz.error(resp.msg);
					return false;
				}
				var result = resp.data;
				Trade.useExptpl = result.expressTemplate;		//模板
				Trade.printExpress(result.printData);	//打印的数据
			});
		});
		$("#myuserexpressdiv a.exp_set").click(function(){
			obz.ajaxJson(obz.ctx + "/express/getUserTplByKey", {expKey : $(this).attr("exp_key")}, function(resp){
				if(resp.code != 200){
					obz.error("获取模快递板数据失败");
					return false;
				}
				Trade.useExptpl = resp.data;
				Trade.expTemplateSetting();
			});
			return false;
		});
		//删除已设置的快递模板
		$("#myuserexpressdiv a.exp_del").click(function(){
			var me = $(this);
			obz.showMessage("确定删除<font color='red'>["+me.attr("exp_name")+"]</font>吗?", function(){
				var expKey = me.attr("exp_key");
				obz.ajaxJson(obz.ctx + "/express/delTemplate", {expKey : expKey}, function(resp){
					if(resp.code != 200){
						obz.error(resp.msg);
						return false;
					}
					Trade.useExptpl = null;
					me.parent().remove();
				});
				return false;
			});
			
		});
		$("#mymoreCond").click(function(){
			var me = $(this);
			var atype = me.html();
			if("更多"==atype){$("#moreCondition").show(); me.html("收起");}else{$("#moreCondition").hide(); me.html("更多");}
		});
	    $(':checkbox[name=myuseexpress]').each(function(){
	        $(this).click(function(){
	            if($(this).attr('checked')){
	                $(':checkbox[name=myuseexpress]').removeAttr('checked');
	                $(this).attr('checked','checked');
	                var me = $(this);
	                var expkey = me.val();
	              	$("#myuserexpressdiv label").each(function(){
						var me = $(this);me.removeClass("expressname");
					});
	                me.next().addClass("expressname");
	            }
	        });
	    });
		searchItems();
	    $("#myqueryBtn").click(function(){
	    	//获取查询条件
	    	startDate = $("#start_date").val();
	    	endDate = $("#end_date").val();
	    	nickName = $("#nick_name").val();
	    	receiverName = $("#receiver_name").val();
	    	receiverPhone = $("#receiver_phone").val();
	    	searchItems();
	    });
	});
	var pageClick = function(pageNo) {
		searchItems(pageNo);
	}
	var searchItems = function(currPage){
		var params = {};
		//其他查询条件
		if(currPage){
			params.page = currPage;
		}
		params.startDate = startDate;
		params.endDate = endDate;
		params.nickNmae = nickName;
		params.receiverName = receiverName;
		params.receiverPhone = receiverPhone;
		params.orderStatus = $("#order_status_sel").val();
		//params.shippingStatus = $("#shipping_status_sel").val();
		$("#mainTable").mask("正在加载订单数据...");
		var url = obz.ctx + "/order/list";
		obz.ajaxJson(url, params, function(resp){
			var result = resp.data;
			$(".tradeLotGrid").empty();
			if(currPage){
				$("#pager").pager({ pagenumber:currPage, recordcount:result.totalRow, pagesize:result.pageSize, recordtext:'共 {0} 页, {1} 条记录', buttonClickCallback: pageClick });
			}else{
				$("#pager").pager({ recordcount:result.totalRow, pagesize:result.pageSize, recordtext:'共 {0} 页, {1} 条记录', buttonClickCallback: pageClick });	
			}
			
			for(var i=0;i<result.list.length;i++){
				var order = result.list[i];
				var trTradeHtml = obz.dataTemplate4obj($("#order_table_tr_tpl").html(), order);
				$(".tradeLotGrid").append(trTradeHtml);
				if(order.orderStatus == '已支付'){
					$("#a_"+order.orderId).show();
					$("#t_"+order.orderId).show();
				}else{
				    $("#a_"+order.orderId).hide();
				    $("#t_"+order.orderId).hide();
				}
				if(order.buyerMemo == null || order.buyerMemo==""){
					$("#imsg_"+order.orderId).hide();
				}else{
					$("#imsg_"+order.orderId).show();
				}
				for(var k=0;k<order.orderItems.length;k++){
					var orderItem = order.orderItems[k];
					var trOrderHtml = obz.dataTemplate4obj($("#order_item_table_tr_tpl").html(), orderItem);
					$("#order_item_" + order.orderId).append(trOrderHtml);
				}
			}
			
			//注册显示详情事件
			TBatch.checkCheckbox(function(){
				$("#checkedLines").html("您选择了<label style='font-size:16px;color:#f00;font-weight:bold;margin:0 3px;'>"+TBatch.getCheckedCount()+"</label>单").css({'margin-left':'20px'});
			});
			TBatch.initCheckboxClick(function(){
				$("#checkedLines").html("您选择了<label style='font-size:16px;color:#f00;font-weight:bold;margin:0 3px;'>"+TBatch.getCheckedCount()+"</label>单").css({'margin-left':'20px'});
			}, function(){
				$("#checkedLines").html("您选择了<label style='font-size:16px;color:#f00;font-weight:bold;margin:0 3px;'>"+TBatch.getCheckedCount()+"</label>单").css({'margin-left':'20px'});
			});
			TBatch.initOptEvent(TableOpt.init());
			$("#mainTable").unmask();
		});
	}
	
	//=============================表格操作事件开始=============================================
	var TableOpt = {
		/* detail : function(param){
			alert(param[1])
		}, */
		send : function(param){
			var url = obz.ctx + "/order/sendgoodsList?orderIds="+param[1];
			var dialog = BootstrapDialog.show({
				size: BootstrapDialog.SIZE_NORMAL,
				title: "商品发货",
		        message: $('<div></div>').load(url)
		    });
		}, 
		refund : function(param){
			var url = obz.ctx + "/order/refund?orderIds="+param[1];
			var dialog = BootstrapDialog.show({
				size: BootstrapDialog.SIZE_NORMAL,
				title: "商品退款",
		        message: $('<div></div>').load(url)
		    });
		},
		init : function(){
			var optArray = new Array();
			//optArray.push(this.detail);
			optArray.push(this.send);
			optArray.push(this.refund);
			return optArray;
		}
	}
	
	$("#mySendProductBtn").click(function(){
		if(TBatch.getCheckedCount() <=0){
			obz.info("请选择订单");
			return false;
		}
		var url = obz.ctx + "/order/sendMoreGoodsList?ids="+TBatch.getChecked();
		var dialog = BootstrapDialog.show({
			size: BootstrapDialog.SIZE_WIDE,
			title: "商品批量发货",
	        message: $('<div></div>').load(url),
	        buttons: [ {
                label: '关闭',
                action: function(dialogItself){
                    dialogItself.close();
                }
            }]
	    });
	});
	$("#order_status_sel").change(function(){
		searchItems();
	});
	//=============================表格操作事件结束=============================================
</script>
<script>
	Template.init("#menu-order");
</script>